﻿<UserControl x:Class="Teudu.InfoDisplay.HandStatusControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" xmlns:teudu="clr-namespace:Teudu.InfoDisplay"
             d:DesignHeight="70" d:DesignWidth="210">
    <UserControl.Resources>
        <teudu:HandDistanceToLineTranslateConverter x:Key="handConverter"/>
        <teudu:BoolColorConverter x:Key="boolConverter"/>
        <teudu:BoolToOpacityConverter x:Key="opacityConverter"/>
        <Storyboard x:Key="MainAppearAnimation">
            <DoubleAnimationUsingKeyFrames
                    Storyboard.TargetProperty="(UserControl.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleX)"
                    Duration="0:0:01" FillBehavior="Stop">
                <LinearDoubleKeyFrame KeyTime="0:0:00" Value="0.01"/>
                <EasingDoubleKeyFrame KeyTime="0:0:01" Value="1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <ElasticEase EasingMode="EaseOut" Oscillations="2"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames
                    Storyboard.TargetProperty="(UserControl.RenderTransform).(TransformGroup.Children)[0].(ScaleTransform.ScaleY)"
                    Duration="0:0:01" FillBehavior="Stop">
                <LinearDoubleKeyFrame KeyTime="0:0:00" Value="0.01"/>
                <EasingDoubleKeyFrame KeyTime="0:0:01" Value="1">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <ElasticEase EasingMode="EaseOut" Oscillations="2"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>
    <Grid>
    <Grid Height="60" Width="150" Opacity="{Binding InRange, Converter={StaticResource opacityConverter}}">
            <TextBlock Text="Engaged" VerticalAlignment="Center" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter}}" Margin="-60,0,0,0"/>
            <TextBlock Text="Disengaged" VerticalAlignment="Center" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter},ConverterParameter=true}" Margin="-60,0,0,0"/>
            <Image Source="/Teudu.InfoDisplay;component/Images/screen.png" Height="60" Width="13" Margin="-20,0,0,0"/>
        <!--<Image Source="/Teudu.InfoDisplay;component/Images/larrow.png" Height="40" Width="50" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter}, FallbackValue=1,ConverterParameter=true}">
            <Image.RenderTransform>
                <TranslateTransform X="0"></TranslateTransform>
            </Image.RenderTransform>
        </Image>
        <Image Source="/Teudu.InfoDisplay;component/Images/rarrow.png" Height="40" Width="50" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter}, FallbackValue=0, ConverterParameter=false}">
            <Image.RenderTransform>
                <TranslateTransform X="0"></TranslateTransform>
            </Image.RenderTransform>
        </Image>-->
        <StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Right" Width="100">
            <Line Stroke="{Binding Path=Engaged, Converter={StaticResource boolConverter}, FallbackValue=Red}" StrokeThickness="3" Y1="0" Y2="40" StrokeDashArray="1,2">
                <Line.RenderTransform>
                    <TranslateTransform X="43"/>
                </Line.RenderTransform>
            </Line>

            <!--<Line Stroke="{Binding Path=TooClose, Converter={StaticResource boolConverter}, ConverterParameter=true, FallbackValue=Red}" StrokeThickness="10" X1="0" X2="40" VerticalAlignment="Center">
                <Line.RenderTransform>
                    <TranslateTransform X="{Binding Path=DistanceFromInvisScreen, Converter={StaticResource handConverter}, FallbackValue=120}" />
                </Line.RenderTransform>
            </Line>-->

            <Grid>
                <Image Source="/Teudu.InfoDisplay;component/Images/hand.png" Height="30" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter},ConverterParameter=true}"/>
                <Image Source="/Teudu.InfoDisplay;component/Images/handactive.png" Height="30" Opacity="{Binding Path=Engaged, Converter={StaticResource opacityConverter}}"/>
                <Grid.RenderTransform>
                    <TranslateTransform X="{Binding Path=DistanceFromInvisScreen, Converter={StaticResource handConverter}, FallbackValue=70}"/>
                </Grid.RenderTransform>
            </Grid>
        </StackPanel>
        <!--<Image Source="/Teudu.InfoDisplay;component/Images/silhouette.png" Height="50">
            <Image.RenderTransform>
                <TranslateTransform X="30" Y="0"/>
            </Image.RenderTransform>
        </Image>-->
        <Grid.RenderTransform>
            <TransformGroup>
                <ScaleTransform ScaleX="1" ScaleY="1" CenterX="75" CenterY="30" />
            </TransformGroup>
        </Grid.RenderTransform>
        <Grid.Style>
            <Style>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding InRange}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard Name="st2">
                                <StaticResource ResourceKey="MainAppearAnimation"/>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                        <DataTrigger.ExitActions>
                            <StopStoryboard BeginStoryboardName="st2"/>
                        </DataTrigger.ExitActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </Grid.Style>
    </Grid>
        <Image Source="/Teudu.InfoDisplay;component/Images/silhouettemissing.png" Height="60" Opacity="{Binding Path=OutOfRange, Converter={StaticResource opacityConverter}}"/>
    </Grid>
</UserControl>
